<style lang="scss" scoped="">
  @import "../../../utils/base.scss";

  .myLabel:before {
    content: '*';
    display: inline-block;
    margin-right: 4px;
    line-height: 1;
    font-family: SimSun;
    font-size: 14px;
    color: #ed4014;
  }

  .myInput {
    border: 1px solid #ed4014
  }

  .myForm {
    position: relative;
    line-height: 32px;
    font-size: 14px;
  }

  #numberfile {
    display: none;
  }
</style>
<template>
  <div style="overflow-x: hidden;">
    <table border="1px" class="tale" v-if="account.length>0 || isEdit">
      <tr align="center" class="tale_title">
        <th>
          <label class="myLabel">账号分类</label>
        </th>
        <th>
          <label v-if="isEdit" class="myLabel">入驻位置</label>
          <label v-else class="myLabel">关联的工具/资源</label>
        </th>
        <th>
          <label class="myLabel">已关联账号数</label>
        </th>
        <th>
          <label class="myLabel">开通账号人员</label>
        </th>
        <td v-if="!isPrint">
          <Button v-if="isEdit" type="primary" size="small" @click="addRow">新增</Button>
          <label v-else>操作</label>
        </td>
      </tr>
      <template v-if="account.length>0" v-for="(item, index) in account">
        <tr align="center" style="height:50px" :key="index">
          <td style="width: 20%">
            <span v-if="!isEdit">{{account[index].sysType}}</span>
            <Select v-else v-model="account[index].sysType" :label-in-value="true" :transfer="true" filterable  allow-create @on-create="createType" @on-change="selectType($event,index)" style="width:90%" align="left">
              <Option v-for="item in sysTypeList" :value="item.sysType" :key="item.sysType" :disabled="item.isDisabled" :label="item.sysType">
              </Option>
            </Select>
          </td>
          <td v-if="isEdit">
            <span v-if="!item.ifedit">{{showSysName(account[index].sysModel)}}</span>
            <Select v-else v-model="account[index].sysIdList" :label-in-value="true" :transfer="true" filterable
              multiple style="width:90%" @on-change="selectSys($event, index)" align="left">
              <Option v-for="item in sysList" :value="item.id" :key="item.id" :disabled="item.isDisabled"
                :label="item.sysName">
              </Option>
            </Select>
          </td>
          <td v-else>
            <span>{{account[index].res_tool_Name}}</span>
          </td>
          <td>
            <span>{{showCount(item)}}</span>
          </td>
          <td>
            <template v-for="(name, key) in account[index].usePeopleList">
              <p>name</p>
            </template>
          </td>
          <td style="width:18%" v-if="!isPrint">
            <Button v-if="isEdit || !isShow" type="warning" size="small" @click="removeRow(index)">删除</Button>
            <Button type="primary" size="small" @click="expandRow(index)">{{(item.isExpand < 0)?'展开':'收起'}}</Button>
          </td>
          </Form>
        </tr>
        <tr v-show="item.isExpand >= 0">
          <td colspan="7">
            <Form ref="account[index]" :model="account[index]" label-position="left" :label-width="120"
              style="position:relative;left:4%;padding:1%;">
              <Row>
                <Col>
                <FormItem label="账号类型：">
                  <Col v-if="item.ifedit || account[index].isSever">
                  <Checkbox v-model="account[index].isSever" @on-change="changeSever(index)" :disabled="!item.ifedit">
                    <span>主机账号</span>
                  </Checkbox>
                  <table border="1px" class="tale" style="position:relative;left:2%;max-width:90%"
                    v-if="account[index].isSever">
                    <tr align="center" class="tale_title">
                      <th>
                        <label class="myLabel">账号属性</label>
                      </th>
                      <th>
                        <label class="myLabel">设备IP地址</label>
                      </th>
                      <th>
                        <label>设备名称</label>
                      </th>
                      <th>
                        <label>组读和执行权限目录</label>
                      </th>
                      <th>
                        <label>该用户组需写权限目录</label>
                      </th>
                      <td v-if="item.ifedit">
                        <Button type="primary" size="small" @click="addServer(index)">新增</Button>
                      </td>
                    </tr>
                    <template v-for="(ser, ser_index) in account[index].servers">
                      <tr align="center" style="height:50px">
                        <td style="width:8%">
                          <span v-if="!item.ifedit">{{account[index].servers[ser_index].accountAttr}}</span>
                          <Select v-else v-model="account[index].servers[ser_index].accountAttr" style="width:90%"
                            :transfer="true">
                            <Option v-for="item in attrList" :value="item.value" :key="item.value">{{ item.label }}
                            </Option>
                          </Select>
                        </td>
                        <td style="width:10%">
                          <span v-if="!item.ifedit">{{account[index].servers[ser_index].ip}}</span>
                          <Input v-else style="width: 90%;" v-model="account[index].servers[ser_index].ip"></Input>
                        </td>
                        <td style="width:10%">
                          <span v-if="!item.ifedit">{{account[index].servers[ser_index].sname}}</span>
                          <Input v-else style="width:90%;" v-model="account[index].servers[ser_index].sname"></Input>
                        </td>
                        <td style="width:10%">
                          <span v-if="!item.ifedit">{{account[index].servers[ser_index].rxPath}}</span>
                          <Input v-else style="width: 90%;" v-model="account[index].servers[ser_index].rxPath"></Input>
                        </td>
                        <td style="width:10%">
                          <span v-if="!item.ifedit">{{account[index].servers[ser_index].wpath}}</span>
                          <Input v-else style="width: 90%;" v-model="account[index].servers[ser_index].wpath"></Input>
                        </td>
                        <td style="width:5%" v-if="item.ifedit">
                          <Button type="warning" size="small" @click="removeServer(index,ser_index)">删除</Button>
                        </td>
                      </tr>
                    </template>
                  </table>
                  </Col>
                  <Col v-if="item.ifedit || account[index].isDb">
                  <Checkbox v-model="account[index].isDb" @on-change="changeDb(index)" :disabled="!item.ifedit">
                    <span>数据库账号</span>
                  </Checkbox>
                  <table border="1px" class="tale" style="position:relative;left:2%;max-width:90%"
                    v-if="account[index].isDb">
                    <tr align="center" class="tale_title">
                      <th>
                        <label class="myLabel">数据库类型</label>
                      </th>
                      <th>
                        <label class="myLabel">账号属性</label>
                      </th>
                      <th>
                        <label class="myLabel">设备IP地址</label>
                      </th>
                      <th>
                        <label>资源池/设备名称</label>
                        <Tooltip content="数据库类型为GBase或Vertica时必填" max-width="200" placement="right" :transfer="true"
                          style="white-space: normal;width: 10px">
                          <Icon type="md-help-circle" />
                        </Tooltip>
                      </th>
                      <th>
                        <label>schema/集群名</label>
                        <Tooltip content="数据库类型为GBase或Vertica时必填:申请Vertica请填写schema;申请GBase请填写集群名" max-width="200"
                          placement="right" :transfer="true" style="white-space: normal;width: 10px">
                          <Icon type="md-help-circle" />
                        </Tooltip>
                      </th>
                      <th>
                        <label class="myLabel">权限</label>
                      </th>
                      <th>
                        <label>库名</label>
                      </th>
                      <th>
                        <label>表名</label>
                      </th>
                      <td v-if="item.ifedit">
                        <Button type="primary" size="small" @click="addDB(index)">新增</Button>
                      </td>
                    </tr>
                    <template v-for="(db, db_index) in account[index].dbs">
                      <tr align="center" style="height:50px">
                        <td style="width:10%">
                          <span v-if="!item.ifedit">{{account[index].dbs[db_index].dbType}}</span>
                          <Select v-else v-model="account[index].dbs[db_index].dbType" style="width:90%">
                            <Option v-for="item in dbTypeList" :value="item.value" :key="item.value">{{ item.label }}
                            </Option>
                          </Select>
                        </td>
                        <td style="width:10%">
                          <span v-if="!item.ifedit">{{account[index].dbs[db_index].accountAttr}}</span>
                          <Select v-else v-model="account[index].dbs[db_index].accountAttr" style="width:90%">
                            <Option v-for="item in attrList" :value="item.value" :key="item.value">{{ item.label }}
                            </Option>
                          </Select>
                        </td>
                        <td style="width:10%">
                          <span v-if="!item.ifedit">{{account[index].dbs[db_index].ip}}</span>
                          <Input v-else style="width: 90%;" v-model="account[index].dbs[db_index].ip"></Input>
                        </td>
                        <td style="width:10%">
                          <span v-if="!item.ifedit">{{account[index].dbs[db_index].sname}}</span>
                          <Input v-else style="width:90%;" v-model="account[index].dbs[db_index].sname"></Input>
                        </td>
                        <td style="width:10%">
                          <span v-if="!item.ifedit">{{account[index].dbs[db_index].schema}}</span>
                          <Input v-else style="width:90%;" v-model="account[index].dbs[db_index].schema"></Input>
                        </td>
                        <td style="width:10%">
                          <span v-if="!item.ifedit">{{account[index].dbs[db_index].auth}}</span>
                          <Input v-else style="width: 90%;" v-model="account[index].dbs[db_index].auth"></Input>
                        </td>
                        <td style="width:10%">
                          <span v-if="!item.ifedit">{{account[index].dbs[db_index].dbName}}</span>
                          <Input v-else style="width: 90%;" v-model="account[index].dbs[db_index].dbName"></Input>
                        </td>
                        <td style="width:10%">
                          <span v-if="!item.ifedit">{{account[index].dbs[db_index].tableName}}</span>
                          <Input v-else style="width: 90%;" v-model="account[index].dbs[db_index].tableName"></Input>
                        </td>
                        <td style="width:8%" v-if="item.ifedit">
                          <Button type="warning" size="small" @click="removeDB(index,db_index)">删除</Button>
                        </td>
                      </tr>
                    </template>
                  </table>
                  </Col>
                  <Col v-if="item.ifedit || account[index].isHadoop">
                  <Checkbox v-model="account[index].isHadoop" @on-change="changeHadoop(index)" :disabled="!item.ifedit">
                    <span>Hadoop账号</span>
                  </Checkbox>
                  <table border="1px" class="tale" style="position:relative;left:2%;max-width:90%"
                    v-if="account[index].isHadoop">
                    <tr align="center" class="tale_title">
                      <th>
                        <label class="myLabel">keytab描述</label>
                      </th>
                      <th>
                        <label class="myLabel">Hadoop组件</label>
                      </th>
                      <th>
                        <label class="myLabel">具体权限描述</label>
                      </th>
                      <td v-if="item.ifedit">
                        <Button type="primary" size="small" @click="addHadoop(index)">新增</Button>
                      </td>
                    </tr>
                    <template v-for="(hadoop, ha_index) in account[index].hadoops">
                      <tr align="center" style="height:50px">
                        <td style="width:20%">
                          <span v-if="!item.ifedit">{{account[index].hadoops[ha_index].keytab}}</span>
                          <Input v-else style="width:90%;" v-model="account[index].hadoops[ha_index].keytab"></Input>
                        </td>
                        <td style="width:15%">
                          <span v-if="!item.ifedit">{{account[index].hadoops[ha_index].hadoopAccountType}}</span>
                          <Select v-else filterable v-model="account[index].hadoops[ha_index].hadoopAccountType"
                            style="width:90%">
                            <Option v-for="item in hadoopList" :value="item.value" :key="item.value">{{ item.label }}
                            </Option>
                          </Select>
                        </td>
                        <td>
                          <span v-if="!item.ifedit">{{account[index].hadoops[ha_index].auth}}</span>
                          <Input v-else style="width: 90%;" v-model="account[index].hadoops[ha_index].auth"></Input>
                        </td>
                        <td style="width:8%" v-if="item.ifedit">
                          <Button type="warning" size="small" @click="removeHadoop(index,ha_index)">删除</Button>
                        </td>
                      </tr>
                    </template>
                  </table>
                  </Col>
                  <Col v-if="item.ifedit || account[index].isHftp">
                  <Checkbox v-model="account[index].isHftp" @on-change="changeUap(index)" :disabled="!item.ifedit">
                    <span>UAP账号</span>
                  </Checkbox>
                  <template v-if="account[index].isHftp">
                    <Row>
                      <Col style="left:2%">
                      <label class="myLabel">场景说明：</label>
                      </Col>
                      <Col style="left:2%">
                      <Checkbox v-model="account[index].hftps[0].isCluster" :disabled="!item.ifedit">
                        <span>采集交换集群与租户集群数据流转</span>
                      </Checkbox>
                      </Col>
                      <Col style="left:2%">
                      <Checkbox v-model="account[index].hftps[0].isPerson" :disabled="!item.ifedit">
                        <span>采集交换集群与租户个人FTP数据流转</span>
                      </Checkbox>
                      </Col>
                      <Col style="left:2%">
                      <Checkbox v-model="account[index].hftps[0].isPro" :disabled="!item.ifedit">
                        <span>采集交换集群与生产集群（如Hadoop三期二生产集群）数据流转</span>
                      </Checkbox>
                      </Col>
                    </Row>
                  </template>
                  </Col>
                  <Col v-if="item.ifedit || account[index].isPaas">
                  <Checkbox v-model="account[index].isPaas" @on-change="changePaas(index)" :disabled="!item.ifedit">
                    <span>PaaS门户账号</span>
                  </Checkbox>
                  <template v-if="account[index].isPaas">
                    <Row style="left:2%">
                      <Col span="11">
                      <FormItem label="账号类型：" :label-width="120" :required="true">
                        <Select v-model="account[index].paas[0].paasType" style="width:43%" :disabled="!item.ifedit">
                          <Option v-for="item in paasList" :value="item.value" :key="item.value">{{ item.label }}
                          </Option>
                        </Select>
                      </FormItem>
                      </Col>
                    </Row>
                  </template>
                  </Col>
                  <Col v-if="item.ifedit || account[index].isDacp">
                  <Checkbox v-model="account[index].isDacp" @on-change="changeDacp(index)" :disabled="!item.ifedit">
                    <span>DACP账号</span>
                  </Checkbox>
                  <template v-if="account[index].isDacp">
                    <Row style="left:2%">
                      <Col span="11">
                      <FormItem label="账号类型：" :label-width="120" :required="true">
                        <Select v-model="account[index].dacps[0].dacpAccoutType" style="width:43%"
                          :disabled="!item.ifedit">
                          <Option v-for="item in dacpList" :value="item.value" :key="item.value">{{ item.label }}
                          </Option>
                        </Select>
                      </FormItem>
                      </Col>
                    </Row>
                  </template>
                  </Col>
                  <Col v-if="item.ifedit || account[index].isElse">
                  <Checkbox v-model="account[index].isElse" @on-change="changeElse(index)" :disabled="!item.ifedit">
                    <span>其他权限内容</span>
                  </Checkbox>
                  <template v-if="account[index].isElse">
                    <label class="myLabel"></label>
                    <Input v-model="account[index].elseAuthes[0].des" size="small" style="width:40%;padding-top: 5px"
                      :readonly="!item.ifedit" type="textarea" :autosize="true" />
                  </template>
                  </Col>
                </FormItem>
                </Col>
              </Row>
            </Form>
          </td>
        </tr>
      </template>
    </table>
    <div v-else>
      <div class="gcontent" style="text-align:center">
        <span style="font-size: 13px;margin-left: 15px;color:#bbb; ">暂无相关账号信息</span>
      </div>
    </div>

  </div>
</template>

<script>
  import Axios from 'axios'
  import ajax from "../../../ajax_util"

  export default {
    components: {},
    data() {
      return {
        // account:[],
        toolAccountAll: [],
        resAccountAll: [],
        type: 2,
        sysList: [],
        resourceList: [],
        toolList: [],
        res_toolId: 0,
        sysTypeList:[],
        attrList: [{
            value: "个人实名制账号",
            label: "个人实名制账号"
          },
          {
            value: "程序内置账号",
            label: "程序内置账号"
          },
          {
            value: "超级用户账号",
            label: "超级用户账号"
          },
          {
            value: "FTP账号",
            label: "FTP账号"
          },
          {
            value: "前台账号",
            label: "前台账号"
          }
        ],
        dbTypeList: [{
            value: "Mysql",
            label: "Mysql"
          },
          {
            value: "GBase",
            label: "GBase"
          },
          {
            value: "Vertica",
            label: "Vertica"
          },
          {
            value: "其他",
            label: "其他"
          }
        ],
        paasList: [{
            value: "paas_huawei",
            label: "华为PaaS"
          },
          {
            value: "paas_asia",
            label: "亚信PaaS"
          }
        ],
        dacpList: [{
            value: "平台管理",
            label: "平台管理"
          },
          {
            value: "开发管理(团队管理员)",
            label: "开发管理(团队管理员)"
          },
          {
            value: "数据开发(团队成员)",
            label: "数据开发(团队成员)"
          }
        ],
        hadoopList: [{
            value: "HDFS",
            label: "HDFS"
          },
          {
            value: "Hive",
            label: "Hive"
          },
          {
            value: "HBase",
            label: "HBase"
          },
          {
            value: "Kafka",
            label: "Kafka"
          },
          {
            value: "Flume",
            label: "Flume"
          },
          {
            value: "UDF",
            label: "UDF"
          },
          {
            value: "HFTP",
            label: "HFTP"
          },
          {
            value: "其他",
            label: "其他"
          }
        ],
        typeList: [{
            id: 1,
            typeName: "资源账号配置"
          },
          {
            id: 2,
            typeName: "工具账号配置"
          }
        ],
        tool_temp_id:[],
        res_temp_id:[]
      }
    },
    created: function() {
      // console.log("----account--------",this.account,this.ifedit);
      // // this.getId();
      // if(this.isEdit){
      //  this.getSys();
      //  this.setType();
      // }else if(!this.isShow){
      //  this.getAllToolAccount();
      //  // this.getAllResAccount();
      // }
    },
    mounted() {
      console.log("----account--------", this.account, this.ifedit);
      // this.getId();
      if (this.isEdit) {
        this.getSys();
        this.setType();
      } else {
        if (!this.isPrint && !this.ifedit) {
          this.getAllToolAccount();
          // this.getAllResAccount();
        } else if (!this.isPrint && this.ifedit) {
          this.getDetailAccount();
        }
      }
    },
    methods: {
      createType(value){
        this.sysTypeList.push({
          sysType:value
        })
      },
      showCount(item) {
        var str = "";
        if (item.isSever) {
          str = str + "主机账号" + item.servers.length + "个;"
        }

        if (item.isDb) {
          str = str + "数据库账号" + item.dbs.length + "个;"
        }

        if (item.isHadoop) {
          str = str + "Hadoop账号" + item.hadoops.length + "个;"
        }

        if (item.isHftp) {
          str = str + "UAP账号" + item.hftps.length + "个;"
        }

        if (item.isPaas) {
          str = str + "paas账号" + item.paas.length + "个;"
        }

        if (item.isDacp) {
          str = str + "dacps账号" + item.dacps.length + "个;"
        }

        if (item.isElse) {
          str = str + "其他权限账号" + item.elseAuthes.length + "个；"
        }

        return str;
      },
      setType() {
        if (this.checkType == "tool") {
          this.type = 2;
          var url = this.CONFIG.progress_url + "/sysaccount/getToolSysType";
        } else {
          this.type = 1;
          var url = this.CONFIG.progress_url + "/sysaccount/getResSysType";
        }

        var that = this;
        ajax.get({
          that: that,
          url: url,
          success: function(data) {
            that.sysTypeList = data;
            console.log("---sysList-------", data);
            that.getId();
          }
        })
      },
      getId() {
        console.log("-----2-------", this.$parent);
        this.res_toolId = this.$parent.applyInfo.id;
        this.getSysAccount();
      },
      // getSysType(){
      //   var that = this;
      //   var url = this.CONFIG.progress_url + "/sysaccount/getSysType";
      //   ajax.get({
      //     that: that,
      //     url: url,
      //     success: function(data) {
      //       that.sysTypeList = data;
      //       console.log("---sysList-------", data);
      //     }
      //   })
      // },
      getSys() {
        var that = this;
        var url = this.CONFIG.progress_url + "/system-map/for/paas";
        ajax.get({
          that: that,
          url: url,
          success: function(data) {
            that.sysList = data;
            console.log("---sysList-------", data);
          }
        })
      },
      getSysAccount() {
        console.log("=======方法啊啊啊啊========");
        this.account = [];
        var params = {}
        var that = this;
        if (this.checkType == "tool") {
          params.toolId = this.res_toolId;
          var url = this.CONFIG.progress_url + "/toolaccount/getById/";
        } else {
          params.resId = this.res_toolId;
          var url = this.CONFIG.progress_url + "/resaccount/getById/";
        }

        ajax.get({
          that: that,
          url: url,
          params: params,
          success: function(data) {
            console.log("---getSysAccount-------", data);
            data.forEach(item => {
              item.ifedit = true;
            })
            that.account = data;
          }
        })
      },
      selectType(data, index){
        console.log("====selectType====",this.sysTypeList);
        console.log(data,index);
        if(data != undefined && data != null && data != ""){
          this.sysTypeList.forEach(item=>{
            if(item.sysType == data.value && item.id>0){
              console.log("-",item);
              var temp = JSON.stringify(item);
              var json = JSON.parse(temp);

              var account = {
                id: 0,
                res_tool_id: this.res_toolId,
                res_tool_Name: "",
                sysIdList: json.sysIdList,
                sysModel: json.sysModel,
                servers: json.servers,
                dbs: json.dbs,
                hadoops: json.hadoops,
                hftps: json.hftps,
                paas: json.paas,
                dacps: json.dacps,
                elseAuthes: json.elseAuthes,
                sysType:json.sysType,
                isExpand: 0,
                ifedit: true,

                isSever: json.isSever,
                isDb: json.isDb,
                isHadoop: json.isHadoop,
                isHftp: json.isHftp,
                isPaas: json.isPaas,
                isDacp: json.isDacp,
                isElse: json.isElse,

                type: this.type
              }

              this.$set(this.account, index, account)
              // this.account[index] = account;
              return true;
            }
          })
        }
        // this.$forceUpdate();
      },
      getAllToolAccount() {
        var that = this;
        var url = this.CONFIG.progress_url + "/toolaccount/getAll";
        ajax.get({
          that: that,
          url: url,
          success: function(data) {
            console.log("---getAllToolAccount-------", data);
            that.toolAccountAll = data;
            that.getAllResAccount();
          }
        })
      },
      getAllResAccount() {
        var that = this;
        var url = this.CONFIG.progress_url + "/resaccount/getAll";
        ajax.get({
          that: that,
          url: url,
          success: function(data) {
            console.log("---getAllResAccount-------", data, that.isEdit);
            that.resAccountAll = data;

            // if(!that.isEdit){
            //  console.log("------this.$parent----",that.$parent);
            //  that.$parent.$parent.getPeopleAccount();
            // }
          }
        })
      },
      getDetailAccount() {
        console.log("------getDetailAccount------", this.$parent.applyinfo, this.account)
        var account = this.$parent.applyinfo ? this.$parent.applyinfo.account : this.account;
        if (account != undefined && account != null) {
          if (account.people != undefined && account.people != null && account.people.length > 0) {
            var people = account.people
            console.log("------getDetailAccount------", people)
            var serviceId = [];
            // people.forEach(val => {
            if (people[0].severs != undefined && people[0].severs != null && people[0].severs.length > 0) {
              people[0].severs.forEach(item => {
                if (serviceId.indexOf(item.serviceId) < 0) {
                  serviceId.push(item.serviceId);
                }
              })
            }

            if (people[0].dbs != undefined && people[0].dbs != null && people[0].dbs.length > 0) {
              people[0].dbs.forEach(item => {
                if (serviceId.indexOf(item.serviceId) < 0) {
                  serviceId.push(item.serviceId);
                }
              })
            }

            if (people[0].hadoops != undefined && people[0].hadoops != null && people[0].hadoops.length > 0) {
              people[0].hadoops.forEach(item => {
                if (serviceId.indexOf(item.serviceId) < 0) {
                  serviceId.push(item.serviceId);
                }
              })
            }

            if (people[0].hftps != undefined && people[0].hftps != null && people[0].hftps.length > 0) {
              people[0].hftps.forEach(item => {
                if (serviceId.indexOf(item.serviceId) < 0) {
                  serviceId.push(item.serviceId);
                }
              })
            }

            if (people[0].paas != undefined && people[0].paas != null && people[0].paas.length > 0) {
              people[0].paas.forEach(item => {
                if (serviceId.indexOf(item.serviceId) < 0) {
                  serviceId.push(item.serviceId);
                }
              })
            }

            if (people[0].dacps != undefined && people[0].dacps != null && people[0].dacps.length > 0) {
              people[0].dacps.forEach(item => {
                if (serviceId.indexOf(item.serviceId) < 0) {
                  serviceId.push(item.serviceId);
                }
              })
            }

            if (people[0].elseAuthes != undefined && people[0].elseAuthes != null && people[0].elseAuthes.length > 0) {
              people[0].elseAuthes.forEach(item => {
                if (serviceId.indexOf(item.serviceId) < 0) {
                  serviceId.push(item.serviceId);
                }
              })
            }
            // })

            this.getAccountList(serviceId);
          }
        }
      },
      getAccountList(serviceId) {
        var that = this;
        var url = this.CONFIG.progress_url + "/sysaccount/getByIdList";
        console.log("---getSysAccount-------", serviceId);
        ajax.post({
          that: that,
          url: url,
          data: serviceId,
          success: function(data) {
            console.log("-----getAccountList-------", data, that.dataInfo);
            if(that.isSon){
              var temp = []
              if (that.dataInfo) {
                that.dataInfo.resourceList.forEach(resource => {
                  var index = data.findIndex(e => e.res_tool_id == resource.serviceId)
                  if (index != -1) {
                    temp.push(data[index])
                  }
                })
                that.dataInfo.severList.forEach(resource => {
                  var index = data.findIndex(e => e.res_tool_id == resource.serviceId)
                  if (index != -1) {
                    temp.push(data[index])
                  }
                })
                that.dataInfo.toolList.forEach(tool => {
                  var index = data.findIndex(e => e.res_tool_id == tool.toolId)
                  if (index != -1) {
                    temp.push(data[index])
                  } 
                  if (tool.resourceProgress) {
                    tool.resourceProgress.forEach(item => {
                      var index = data.findIndex(e => e.res_tool_id == item.serviceId)
                      if (index != -1) {
                        temp.push(data[index])
                      }
                    })
                  }
                })
              }
              that.account = temp;
            }else{
              that.account = data;
            }
            console.log("======dasdasdas==account=============",that.account);

          }
        })
      },
      showSysName(sysModel) {
        var str = "";
        if (sysModel != undefined && sysModel != null) {
          for (var i = 0; i < sysModel.length; i++) {
            if (sysModel[i].id > 0) {
              str = str + sysModel[i].sysName + "、"
            }
          }

          str = str.slice(0, str.length - 1);
        }
        return str;
      },
      selectSys(data, index) {
        console.log("=====selectSys=========", data, this.account[index].sysIdList, index);
      },
      addRow() {
        this.account.push({
          id: 0,
          res_tool_id: this.res_toolId,
          res_tool_Name: "",
          sysIdList: [],
          sysModel: [],
          servers: [],
          dbs: [],
          hadoops: [],
          hftps: [],
          paas: [],
          dacps: [],
          elseAuthes: [],
          isExpand: 0,
          ifedit: true,
          sysType:"",

          isSever: false,
          isDb: false,
          isHadoop: false,
          isHftp: false,
          isPaas: false,
          isDacp: false,
          isElse: false,

          type: this.type
        })
      },
      editRow(index) {
        if (this.account[index].ifedit) {
          this.account[index].ifedit = false;
        } else {
          this.account[index].ifedit = true;
          this.account[index].isExpand = 0;
        }
        // this.$forceUpdate();
      },
      removeRow(index) {
        this.$Modal.confirm({
          title: '确定删除该配置？',
          width: '360',
          onOk: () => {
            this.account.splice(index, 1);
          }
        });
      },
      expandRow(index) {
        console.log("----",this.account[index].isExpand);
        if (this.account[index].isExpand < 0) {
          this.account[index].isExpand = 0;
          console.log("--0000--",this.account[index].isExpand);
        } else {
          this.account[index].isExpand = -1;
          console.log("---1-1-1-1--",this.account[index].isExpand);
        }
        // this.$forceUpdate();
      },
      ok(index) {
        var that = this;
        // if(this.account[index].isUpdate){
        //  var url = this.CONFIG.progress_url + "/sysaccount/add";
        // }else{
        //  var url = this.CONFIG.progress_url + "/sysaccount/update";
        // }

        var url = this.CONFIG.progress_url + "/sysaccount/add";
        console.log("---getSysAccount-------", this.account[index]);
        ajax.post({
          that: that,
          url: url,
          data: this.account[index],
          success: function(data) {
            that.account[index].ifedit = false;
            that.getSysAccount();
          }
        })
      },
      cancel(index) {
        this.account[index].ifedit = false;
        this.getSysAccount();
      },
      changeSever(index) {
        this.account[index].servers = [];
        if (this.account[index].isSever) {
          this.account[index].servers.push({
            accountAttr: "",
            id: 0,
            ip: "",
            rxPath: "",
            sname: "",
            wpath: ""
          });
        }
      },
      addServer(index) {
        this.account[index].servers.push({
          accountAttr: "",
          id: 0,
          ip: "",
          rxPath: "",
          sname: "",
          wpath: "",
          serviceId: 0
        });
      },
      removeServer(index, ser_index) {
        this.account[index].servers.splice(ser_index, 1);
      },
      changeDb(index) {
        this.account[index].dbs = [];
        if (this.account[index].isDb) {
          this.account[index].dbs.push({
            accountAttr: "",
            auth: "",
            dbName: "",
            dbType: "",
            id: 0,
            ip: "",
            sname: "",
            tableName: "",
            schema: ""
          });
        }
      },
      addDB(index) {
        this.account[index].dbs.push({
          accountAttr: "",
          auth: "",
          dbName: "",
          dbType: "",
          id: 0,
          ip: "",
          sname: "",
          tableName: "",
          serviceId: 0,
          schema: ""
        });
      },
      removeDB(index, db_index) {
        this.account[index].dbs.splice(db_index, 1);
      },
      changeHadoop(index) {
        this.account[index].hadoops = [];
        if (this.account[index].isHadoop) {
          this.account[index].hadoops.push({
            hadoopAccountType: "",
            auth: "",
            keytab: "",
            id: 0
          });
        }
      },
      addHadoop(index) {
        this.account[index].hadoops.push({
          hadoopAccountType: "",
          auth: "",
          keytab: "",
          id: 0,
          serviceId: 0
        });
      },
      removeHadoop(index, ha_index) {
        this.account[index].hadoops.splice(ha_index, 1);
      },
      changeUap(index) {
        this.account[index].hftps = [];
        if (this.account[index].isHftp) {
          this.account[index].hftps.push({
            id: 0,
            isCluster: false,
            isPerson: false,
            isPro: false,
            serviceId: 0
          });
        }
      },
      changePaas(index) {
        this.account[index].paas = [];
        if (this.account[index].isPaas) {
          this.account[index].paas.push({
            id: 0,
            paasType: "",
            serviceId: 0
          });
        }
        console.log(this.account[index].paas);
      },
      changeDacp(index) {
        this.account[index].dacps = [];
        if (this.account[index].isDacp) {
          this.account[index].dacps.push({
            dacpAccoutType: "",
            id: 0,
            serviceId: 0
          });
        }
      },
      changeElse(index) {
        console.log("1", this.account[index]);
        this.account[index].elseAuthes = [];
        if (this.account[index].isElse) {
          this.account[index].elseAuthes.push({
            des: "",
            id: 0,
            serviceId: 0
          });
        }
        console.log("2", this.account[index].elseAuthes);
      },
      setToolAccount(toolList, entrySysId, serviceIdList) {
        console.log("-------6666666------", toolList, entrySysId, this, this.toolAccountAll);
        var toolIdList = [];
        toolList.forEach(item => {
          if (item.toolList != undefined && item.toolList != null && item.toolList.length > 0) {
            item.toolList.forEach(value => {
              if (value.check) {
                toolIdList.push(value.id)
              }
            })
          }
        })

        for (var i = 0; i < this.account.length; i++) {
          if (this.account[i].type == 2) {
            console.log("------", i);
            this.account.splice(i, 1);
            i = i - 1;
          }
        }

        var typeList = [];
        this.toolAccountAll.forEach(item => {
          // console.log("====account22========",item);
          if (!this.ifedit && toolIdList.indexOf(item.res_tool_id) > -1 && item.sysIdList.indexOf(entrySysId) > -1 && typeList.indexOf(item.sysType) < 0) {
            // console.log("====account3333========",item);
            this.account.push(item);
            typeList.push(item.sysType);
          } else if (this.ifedit && serviceIdList.indexOf(item.id) > -1 && typeList.indexOf(item.sysType) < 0) {
            this.account.push(item);
            typeList.push(item.sysType);
          }
        })
      },
      setResAccount(resourceInfo, entrySysId, idList, serviceIdList) {
        console.log("-------99999999------", resourceInfo, entrySysId, idList);
        var resIdList = [];
        resourceInfo.forEach(item => {
          if (item.list != undefined && item.list != null && item.list.length > 0) {
            item.list.forEach(value => {
              if (value.check) {
                if (value.serviceId == undefined || value.serviceId == null || value.serviceId == 0) {
                  resIdList.push(value.id)
                } else {
                  resIdList.push(value.serviceId)
                }
              }
            })
          }
        })

        idList.forEach(item => {
          resIdList.push(item)
        })

        for (var i = 0; i < this.account.length; i++) {
          if (this.account[i].type == 1) {
            this.account.splice(i, 1);
            i = i - 1;
          }
        }

        var typeList = [];
        this.resAccountAll.forEach(item => {
          console.log("----uuuuuu-------");
          if (!this.ifedit && resIdList.indexOf(item.res_tool_id) > -1 && item.sysIdList.indexOf(entrySysId) > -1 && typeList.indexOf(item.sysType) < 0) {
            console.log("----bbbb-------");
            this.account.push(item);
            typeList.push(item.sysType);
          } else if (this.ifedit && serviceIdList.indexOf(item.id) > -1 && typeList.indexOf(item.sysType) < 0) {
            this.account.push(item);
            typeList.push(item.sysType);
          }
        })
        console.log("-------gggggg------", resIdList, this.resAccountAll);
      },
      checkIP(data) {
        let ipRegex =
          /^(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])$/
        if (ipRegex.test(data) === false) {
          return false;
        } else {
          return true;
        }
      },
      validate() {
        console.log("-----hhhhhh-------", this.account);
        var vaild = true;

        for (var i = 0; i < this.account.length; i++) {
          var number = i + 1
          if (this.account[i].sysType == undefined || this.account[i].sysType == null || this.account[i].sysType == "") {
            this.$Message.error({
              content: '第' + number + '条账号配置请选择账号分类!',
              duration: 3
            });
            vaild = false;
            return vaild;
          }

          if (this.account[i].sysIdList == undefined || this.account[i].sysIdList == null || this.account[i].sysIdList
            .length < 1) {
            this.$Message.error({
              content: '第' + number + '条账号配置请选择入驻位置!',
              duration: 3
            });
            vaild = false;
            return vaild;
          }

          if (!(this.account[i].isSever || this.account[i].isDb || this.account[i].isHadoop || this.account[i].isHftp ||
              this.account[i].isPaas || this.account[i].isDacp || this.account[i].isElse)) {
            this.$Message.error({
              content: '请第' + number + '条账号配置至少选择一种账号类型!',
              duration: 3
            });
            vaild = false;
            return vaild;
          }

          if (this.account[i].isSever) {
            if (this.account[i].servers.length === 0) {
              this.$Message.error({
                content: '请第' + number + '条账号配置至少新增一个主机账号!',
                duration: 3
              });
              vaild = false;
              return vaild;
            } else {
              for (var j = 0; j < this.account[i].servers.length; j++) {
                var number2 = j + 1
                if (this.utils.objectIsEmpty(this.account[i].servers[j].accountAttr)) {
                  this.$Message.error({
                    content: '请填写第' + number + '条账号申请中第' + number2 + '条主机账号的账号属性!',
                    duration: 5
                  });
                  vaild = false;
                  return vaild;
                }
                if (this.utils.objectIsEmpty(this.account[i].servers[j].ip)) {
                  this.$Message.error({
                    content: '请填写第' + number + '条账号申请中第' + number2 + '条主机账号的设备IP地址!',
                    duration: 5
                  });
                  vaild = false;
                  return vaild;
                }
                if (!this.checkIP(this.account[i].servers[j].ip)) {
                  this.$Message.error({
                    content: '第' + number + '条账号申请中第' + number2 + '条主机账号的设备IP地址格式不正确!',
                    duration: 5
                  });
                  vaild = false;
                  return vaild;
                }
              }
            }
          }

          if (this.account[i].isDb) {
            if (this.account[i].dbs.length === 0) {
              this.$Message.error({
                content: '请第' + number + '条账号申请的至少新增一个数据库账号!',
                duration: 3
              });
              vaild = false;
              return vaild;
            } else {
              for (var j = 0; j < this.account[i].dbs.length; j++) {
                var number2 = j + 1
                if (this.utils.objectIsEmpty(this.account[i].dbs[j].dbType)) {
                  this.$Message.error({
                    content: '请填写第' + number + '条账号申请中第' + number2 + '条数据库账号的数据库类型!',
                    duration: 5
                  });
                  vaild = false;
                  return vaild;
                }
                if (this.utils.objectIsEmpty(this.account[i].dbs[j].accountAttr)) {
                  this.$Message.error({
                    content: '请填写第' + number + '条账号申请中第' + number2 + '条数据库账号的账号属性!',
                    duration: 5
                  });
                  vaild = false;
                  return vaild;
                }
                if (this.utils.objectIsEmpty(this.account[i].dbs[j].ip)) {
                  this.$Message.error({
                    content: '请填写第' + number + '条账号申请中第' + number2 + '条数据库账号的设备IP地址!',
                    duration: 5
                  });
                  vaild = false;
                  return vaild;
                }

                if (!this.checkIP(this.account[i].dbs[j].ip)) {
                  this.$Message.error({
                    content: '第' + number + '条账号申请中第' + number2 + '条数据库账号的设备IP地址格式不正确!',
                    duration: 5
                  });
                  vaild = false;
                  return vaild;
                }
                if (this.utils.objectIsEmpty(this.account[i].dbs[j].sname) && (this.account[i].dbs[j].dbType ===
                    "GBase" || this.account[i].dbs[j].dbType === "Vertica")) {
                  this.$Message.error({
                    content: '请填写第' + number + '条账号申请中第' + number2 + '条数据库账号的资源池/设备名称!',
                    duration: 5
                  });
                  vaild = false;
                  return vaild;
                }
                if (this.utils.objectIsEmpty(this.account[i].dbs[j].auth)) {
                  this.$Message.error({
                    content: '请填写第' + number + '条账号申请中第' + number2 + '条数据库账号的权限!',
                    duration: 5
                  });
                  vaild = false;
                  return vaild;
                }
              }
            }
          }

          if (this.account[i].isHadoop) {
            if (this.account[i].hadoops.length === 0) {
              this.$Message.error({
                content: '请第' + number + '条账号申请的至少新增一个Hadoop账号!',
                duration: 3
              });
              vaild = false;
              return vaild;
            } else {
              for (var j = 0; j < this.account[i].hadoops.length; j++) {
                var number2 = j + 1
                if (this.utils.objectIsEmpty(this.account[i].hadoops[j].keytab)) {
                  this.$Message.error({
                    content: '请填写第' + number + '条账号申请中第' + number2 + '条Hadoop账号的keytab描述!',
                    duration: 5
                  });
                  vaild = false;
                  return vaild;
                }
                if (this.utils.objectIsEmpty(this.account[i].hadoops[j].hadoopAccountType)) {
                  this.$Message.error({
                    content: '请填写第' + number + '条账号申请中第' + number2 + '条Hadoop账号的Hadoop组件!',
                    duration: 5
                  });
                  vaild = false;
                  return vaild;
                }
                if (this.utils.objectIsEmpty(this.account[i].hadoops[j].auth)) {
                  this.$Message.error({
                    content: '请填写第' + number + '条账号申请中第' + number2 + '条Hadoop账号的具体权限描述!',
                    duration: 5
                  });
                  vaild = false;
                  return vaild;
                }
              }
            }
          }

          if (this.account[i].isHftp) {
            for (var j = 0; j < this.account[i].hftps.length; j++) {
              if (!(this.account[i].hftps[j].isCluster || this.account[i].hftps[j].isPerson || this.account[i].hftps[j]
                  .isPro)) {
                this.$Message.error({
                  content: '请填写第' + number + '条账号申请中UAP账号的场景说明!',
                  duration: 3
                });
                vaild = false;
                return vaild;
              }
            }
          }

          if (this.account[i].isPaas) {
            for (var j = 0; j < this.account[i].paas.length; j++) {
              if (this.account[i].paas[j].paasType === "") {
                this.$Message.error({
                  content: '请填写第' + number + '条账号申请中PaaS门户账号类型!',
                  duration: 3
                });
                vaild = false;
                return vaild;
              }
            }
          }

          if (this.account[i].isDacp) {
            for (var j = 0; j < this.account[i].dacps.length; j++) {
              if (this.account[i].dacps[j].dacpAccoutType === "") {
                this.$Message.error({
                  content: '请填写第' + number + '条账号申请中DACP账号类型!',
                  duration: 3
                });
                vaild = false;
                return vaild;
              }
            }
          }

          if (this.account[i].isElse) {
            for (var j = 0; j < this.account[i].elseAuthes.length; j++) {
              if (this.account[i].elseAuthes[j].des === "") {
                this.$Message.error({
                  content: '请填写第' + number + '条账号申请中其他权限内容的描述!',
                  duration: 3
                });
                vaild = false;
                return vaild;
              }
            }
          }
        }

        return vaild;
      },
    },
    computed: {
      account: {
        get: function() {
          console.log("22222222", this.value);
          return this.value;
        },
        set: function(value) {
          console.log("33333333", value);
          this.$emit('input', value);
        }
      },
    },
    props: {
      // applyInfo:{},
      value: {},
      checkType: {},
      isEdit: {},
      isShow: {},
      ifedit: {},
      isSon: {},
      isPrint: {
        type: Boolean,
        default: false
      },
      dataInfo: {
        default: null
      },
      peopleList:{}
    },
    watch: {
      checkType(value) {
        console.log("-------applyInfo------", value);
        this.checkType = value;
      },
      isEdit(value) {
        console.log("-------applyInfo------", value);
        this.isEdit = value;
      },
      isShow(value) {
        console.log("-------applyInfo------", value);
        this.isShow = value;
      },
      ifedit(value) {
        console.log("-------ifedit------", value);
        this.ifedit = value;
      },
      isPrint(value) {
        console.log("-------applyInfo------", value);
        this.isPrint = value;
      }
    }
  }
</script>
